<template>
  <div id="app">
    <ElTiptapTest />
  </div>
</template>
<script>
export default {
  components: {
    ElTiptapTest: () => import("@/views/ElTiptapTest.vue"),
  },
};
</script>

<style lang="scss">
body {
  padding: 0;
  margin: 0;
}

#app {
  padding: 0;
  margin: 0;
  width: 100vw;
  height: 100vh;
}

// ElSelectDropDown浮层样式
.app_el_dropdown_menu {
  background-color: #0f1f32 !important;
  border-color: #1192cb !important;

  .popper__arrow {
    border-bottom-color: #1192cb !important;

    &::after {
      border-bottom-color: #0f1f32 !important;
    }
  }

  &[x-placement^="top"] .popper__arrow {
    border-top-color: #1192cb !important;

    &::after {
      border-top-color: #0f1f32 !important;
    }
  }

  .el-dropdown-menu__wrap {
    overflow-x: hidden;
  }

  .el-dropdown-menu__item {
    color: #fff;
    background: transparent !important;

    &.hover {
      color: #1192cb !important;
    }
  }
}

.app_color_picker>div:nth-child(2) {
  background: #0f1f32;

  div.colorpicker-pancel,
  div.color-palette {
    background: #0f1f32 !important;
  }
}
</style>
